<!DOCTYPE html>
<html lang="{{ @this->lang() }}">

<head>
    <include href="blocks/head.html" />
    <link rel="stylesheet" href="{{ @BASE }}/css/backlog.css">
    <style type="text/css">
    </style>
</head>

<body class="is-loading {{ @user.rank >= \Model\User::RANK_MANAGER ? 'is-sortable' : '' }}">
    <include href="blocks/navbar.html" />
    <div class="container">
        <div class="row" id="backlog">
            <div class="col-md-6">
                <div class="panel panel-default">
                    <div class="panel-heading has-buttons">
                        {{ @dict.backlog }}&ensp;
                        <div class="btn-group btn-group-xs">
                            <div class="btn-group">
                                <button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown">
                                    <span class="fa fa-filter"></span>&ensp; {{ @dict.groups }}
                                    <span class="caret"></span>
                                </button>
                                <ul class="dropdown-menu" role="menu">
                                    <li>
                                        <a href="#" data-group-id="all" data-user-ids="all">
                                            {{ @dict.all_projects }}
                                        </a>
                                    </li>
                                    <li class="active">
                                        <a href="#" data-my-groups data-user-ids="{{ implode(',', @user_obj->getSharedGroupUserIds()) }}">
                                            {{ @dict.my_groups }}
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#" data-group-id="{{ @user.id }}" data-user-ids="{{ @user.id }}">
                                            {{ @dict.my_projects }}
                                        </a>
                                    </li>
                                    <check if="{{ count(@groups) }}">
                                        <li class="divider"></li>
                                        <repeat group="{{ @groups }}" value="{{ @group }}">
                                            <li>
                                                <a href="#" data-group-id="{{ @group->id }}" data-user-ids="{{ implode(',', @group->getGroupUserIds()) }}">
                                                    {{ @group.name | esc }}
                                                </a>
                                            </li>
                                        </repeat>
                                    </check>
                                </ul>
                            </div>
                            <div class="btn-group">
                                <button type="button" class="btn btn-default btn-xs dropdown-toggle" data-toggle="dropdown">
                                    {{ @dict.cols.type }}
                                    <span class="caret"></span>
                                </button>
                                <ul class="dropdown-menu" role="menu">
                                    <F3:repeat group="{{ @project_types }}" value="{{ @type }}">
                                        <li class="active">
                                            <a href="#" data-type-id="{{ @type.id }}">
                                                {{ isset(@dict[@type.name]) ? @dict[@type.name] : str_replace('_', ' ', @type.name) }}
                                            </a>
                                        </li>
                                    </F3:repeat>
                                </ul>
                            </div>
                        </div>
                        <a href="{{ @BASE }}/issues/new/{{ @issue_type.project }}" class="btn btn-default btn-xs pull-right">
                            <span class="fa fa-plus"></span> {{ @dict.add_project }}
                        </a>
                    </div>
                    <div class="panel-body in" id="panel-0">
                        <div class="panel-head-points text-muted">
                            <span>{{ @dict.backlog_points }}:</span>
                            <span class="points-label">0</span>
                        </div>
                        <ul class="list-group sortable" data-list-id="0">
                            <repeat group="{{ @backlog }}" value="{{ @project }}">
                                <include href="backlog/item.html" />
                            </repeat>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="col-md-6">
                <ul class="nav nav-tabs">
                    <li class="active">
                        <a href="#tab-sprints" data-toggle="tab">{{ @dict.sprints }}</a>
                    </li>
                    <li>
                        <a href="#tab-unsorted" data-toggle="tab">{{ @dict.unsorted_items }}</a>
                    </li>
                </ul>
                <div class="tab-content">
                    <div class="tab-pane active" id="tab-sprints">
                        <repeat group="{{ @sprints }}" key="{{ @key }}" value="{{ @sprint }}">
                            <div class="panel panel-default">
                                <div class="panel-heading has-buttons">
                                    <a class="{{ @key ? 'collapsed' : '' }}" data-toggle="collapse" href="#panel-{{ @sprint.id }}">
                                        {{ @sprint.name }} &mdash; {{ date('n/j', strtotime(@sprint.start_date)) }}-{{ date('n/j', strtotime(@sprint.end_date)) }}
                                    </a>
                                    <a href="{{ @BASE }}/taskboard/{{ @sprint.id }}" data-base-href="{{ @BASE }}/taskboard/{{ @sprint.id }}" class="sprint-board btn btn-default btn-xs pull-right">
                                        <span class="fa fa-list"></span> {{ @dict.taskboard }}
                                    </a>
                                </div>
                                <div class="panel-body {{ @key ? 'collapse' : 'in' }}" id="panel-{{ @sprint.id }}">
                                    <div class="panel-head-points text-muted">
                                        <span>{{ @dict.backlog_points }}:</span>
                                        <span class="points-label-completed">0</span> /
                                        <span class="points-label">0</span>
                                    </div>
                                    <ul class="list-group sortable" data-list-id="{{ @sprint.id }}">
                                        <repeat group="{{ @sprint.projects }}" value="{{ @project }}">
                                            <include href="backlog/item.html" />
                                        </repeat>
                                    </ul>
                                </div>
                            </div>
                        </repeat>
                        <p class="text-center">
                            <a href="{{ @BASE }}/backlog/old">{{ @dict.show_previous_sprints }}</a>
                        </p>
                    </div>
                    <div class="tab-pane" id="tab-unsorted">
                        <ul class="list-group sortable">
                            <repeat group="{{ @unsorted }}" value="{{ @project }}" data-list-id="0">
                                <include href="backlog/item.html" />
                            </repeat>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <include href="blocks/footer.html" />
        <check if="{{ @user.rank >= \Model\User::RANK_MANAGER }}">
            <script type="text/javascript">var sortBacklog = true;</script>
        </check>
        <script src="{{ @BASE }}/js/sortable.min.js"></script>
        <script src="{{ @BASE }}/js/backlog.js"></script>
    </div>
</body>
</html>
